<template>
  <md-nav-bar :title="data.title" backgroundColor="white" />
  <view class="container">
    <view v-for="(text, idx) in data.content" :key="idx">
      <text>{{ text + '\n' }}</text>
    </view>
  </view>
  <view class="agree-wrap" v-if="!data.hideBtn">
    <view class="agree" @click="handleAgree">同意</view>
  </view>
</template>

<script setup lang="ts">
import { onLoad } from '@dcloudio/uni-app';
import { reactive } from 'vue';
// 接口
import api from '@/api';
import { agreementTypeEnum } from '@/data/enum';

const data = reactive({
  title: '',
  content: [] as string[],
  hideBtn: false,
});

const handleAgree = () => {
  uni.$emit('userAgreement', { agree: true });
  uni.navigateBack();
};

/**
 * 接口相关
 */
// 获取协议说明
const fetchGetConfig = async (type: number) => {
  try {
    const res = await api.Common.config({
      type,
    });
    // '/n'为特殊符号需要用正则来处理
    data.content = res.data?.content?.split(/\\n/g) || [];
  } catch (e) {}
};

onLoad((options: any) => {
  data.title = options?.title || '服务条款';
  if (options?.type) {
    const _tyoe = +options.type;
    fetchGetConfig(+options.type);
    if ([agreementTypeEnum['活动规则'], agreementTypeEnum['会员规则'], agreementTypeEnum['A豆说明'], agreementTypeEnum['榜单规则']].includes(_tyoe)) {
      data.hideBtn = true;
    }
  }
});
</script>

<style scoped lang="scss">
.container {
  background: white;
  padding: 40px 24rpx calc(64rpx + $safe-bottom + 24rpx);
  box-sizing: boreder-box;
  min-height: 100vh;
}

.agree-wrap {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  padding: 24rpx;
  padding-bottom: $safe-bottom;
  box-sizing: border-box;
  border-top: 1rpx solid #eee;
}
.agree {
  width: 100%;
  height: 64rpx;
  line-height: 64rpx;
  text-align: center;
  background: #01604a;
  color: white;
  border-radius: 40rpx;
}
</style>
